@CHARSET "UTF-8";
@import url("reset.css");
@import url("login.css");
@import url("tweet.css");

body {
    background: #b0ffb0 url('../img/background3.jpg') no-repeat left top fixed;
    background-size: 100%;
    color : #000;
    font-family : Verdana,Arial,Helvetica,sans-serif;
    font-size : 8pt;
    text-align : left;
}

p {
    margin : 0 0 0 0;
}

a {
    text-decoration : none;
}

h1, h2, h3, h4, h5, h6 {
    font-family : Verdana,Arial,Helvetica,sans-serif;
}

h2 {
    border-bottom : 3px solid #9c3;
    color : #014286;
    font: 20px/20px serif;
    padding : 0 0 7px 5px;
}

h3 {
    border-bottom : 3px solid #9c3;
    color : #014286;
    font: 14px/14px sans-serif;
    padding : 0 0 5px 5px;
}

img {
    border : 0px;
}

html, body {
    height: 100%;
}

.cantos {
    border-radius : 5px;
}

.sombra-caixa {
    box-shadow: rgba(0,0,0,0.8) 0 0 10px;
}

.sombra-texto {
    text-shadow: rgba(64,64,64,0.5) 5px 5px 5px;
}

#geral {
    color : #000;
    min-height : 100%;
    margin : auto;
    position : relative;
}

#header {
    background: #9c3 url('../img/fundo-topo.png') repeat-x;
    height : 40px;
    padding : 0 0 0 0;   
}

#barra {
    margin: auto;
    width: 75%;
}

#titulo {
    color : #fff;
    font-family : Arial, Helvetica, sans-serif;
    font-size: 15pt;
    font-weight : bolder;
    padding : 3px;
    top : 5px;
}

#painel {
    color : #fff;
    padding : 3px;
    position: absolute;
    right : 13%;
    text-align : right;
    top: 0px;
}

#painel img {
    vertical-align : text-bottom;
}

#body {
    background: rgba(255,255,255,0.45);
    height: 100%;
    margin : auto;
    min-height: 100%;
    width : 75%;
}

#menu {
    background: rgba(255,255,255,0);
    height: 100%;
    width:28%;
    margin: 20px;
    float:left;
}

.menu {
    background: #fff;
    padding: 10px;
}

.listaUsuarios {
    background : #fff;
    border : 1px outset #9c3;
}

#content {
    background: #fff;
    color : #000;
    float : left;
    height : 100%;
    margin: 20px;
    padding : 20px 10px 50px 10px;
    width : 61%;
}

#footer {
    background: rgba(255,255,255,0.45);
    height : 40px;
    padding : 0 0 0 0;  
}

.clear {
    clear : both;
}

#erro {
    background : #f5aba7; 
    border : 1px solid #f00;
    padding : 5px;
    text-align: center;
}

#ok {
    background : #6CA6CD; 
    border : 1px solid #00f;
    padding : 5px;
    text-align: center;
}

/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ESTILIZAÇÃO DAS LISTAS DE USUÁRIOS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
.usuario {
    display: block;
    padding: 5px;
}


/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ESTILIZAÇÃO DAS LISTAS DE MENSAGENS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */


.listaMensagens {
    overflow: auto;
}

#mensagem {
    font: 16px/16px sans-serif;
    width: 80%;
}

.mensagem {
    background: #eee;
    border-bottom : 1px solid #ccc ;
    box-shadow : rgba(0,0,128,0.25) 5px 5px 5px;
    display : block;
    font: 14px/14px sans-serif;   
    padding : 10px;
    margin: 10px;
    
}

.usuario_msg {
    font: 10px/10px sans-serif;
}

.msg {
    text-indent: 30px;
}


/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX ESTILIZAÇÃO DOS CAMPOS DE FORMULÁRIOS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */

input {
    border: 1px solid #d3d3d3;
    box-shadow: inset 2px 2px 2px #ccc;
    display: block;
    padding: 5px;
    margin: 3px;
    outline: none;
}

.text{
    border: 1px solid #ccc;
}   